<template>
    <view class="wo-page u-padding-20">
        <view class="wo-page-body u-padding-20">
            <data-form :form-model="manageDetail" :form-config="manageFieldConfig" ref="manageFieldConfig"></data-form>
            <view class="wo-panel-foot u-padding-top-20"><u-button type="success" shape="circle" @click="manageSubmitFunc">提交</u-button></view>
        </view>
        <u-toast ref="uToast" />
    </view>
</template>

<script>
import DataForm from '@/components/data-form';
export default {
    data() {
        return {
            wxUserDetail: {},
            manageDetail: {
                name: '',
                phone: '',
                sms_code: ''
            },
            manageFieldConfig: {
                hospital_id: {
                    field: 'hospital_id',
                    label: '接种点',
                    async initFunc(viewModel) {
                        // 获取区域选择数据
                        let hospitalData = await viewModel.$u.api.hospitalSelectData();
                        if (!hospitalData) {
                            return false;
                        }
                        this.form_select_option = hospitalData;
                        this.resultFunc(viewModel.manageDetail);
                        this.valueFunc(viewModel.manageDetail);
                    },
                    // 结果处理
                    resultFunc(formModel) {
                        if (formModel[this.field]) {
                            for (let index in this.form_select_option) {
                                if (this.form_select_option[index].value == formModel[this.field]) {
                                    this.form_result = this.form_select_option[index].label;
                                    break;
                                }
                            }
                        }
                    },
                    // 赋值处理
                    valueFunc(formModel) {
                        // 选中处理
                        for (let index in this.form_select_option) {
                            if (this.form_select_option[index].value == formModel[this.field]) {
                                this.form_value[0] = parseInt(index);
                                break;
                            }
                        }
                    },
                    form_show: true,
                    form_type: 'select-single-column',
                    form_placeholder: '请选择接种点',
                    form_select_option: [],
                    // 打开选择器
                    form_select_open: false,
                    // 选择结果
                    form_result: '',
                    // 选择值
                    form_value: [0],
                    form_select_confirm(event, formModel) {
                        // 数据赋值
                        formModel[this.field] = event[0].value;
                        this.resultFunc(formModel);
                        this.valueFunc(formModel);
                    }
                },
                name: {
                    field: 'name',
                    label: '管理姓名',
                    form_show: true,
                    form_type: 'input-text',
                    form_placeholder: '请输入管理员姓名'
                },
                phone: {
                    field: 'phone',
                    label: '手机号码',
                    form_show: true,
                    form_type: 'input-number',
                    form_placeholder: '请输入手机号码'
                },
                sms_code: {
                    field: 'sms_code',
                    label: '验证码',
                    form_show: true,
                    form_type: 'input-sms-code',
                    form_placeholder: '请输入短信验证码',
                    form_phone: 'phone',
                    form_action: 'manage'
                }
            }
        };
    },
    components: {
        DataForm
    },
    methods: {
        // 页面初始化
        async initPageFunc(option) {
            // 获取用户信息
            if (!this.vuex_wx_token) {
                if (this.clientType == 'wechat_mobile' || this.clientType == 'wechat_computer') {
                    let loginInfo = this.$wx.loginFunc(this.$config.wx_id, this.$config.wx_login_link, this.$config.wx_login_scope, this.$config.wx_success_redirect, this.$config.wx_error_redirect);
                    if (!loginInfo) {
                        return false;
                    }
                    this.$u.vuex('vuex_wx_id', loginInfo.id);
                    this.$u.vuex('vuex_wx_token', loginInfo.token);
                } else {
                    return false;
                }
            }
            // 字段初始化
            for (let field in this.manageFieldConfig) {
                if (this.manageFieldConfig[field].hasOwnProperty('initFunc')) {
                    this.manageFieldConfig[field].initFunc(this);
                }
            }
            this.pageInit = true;
        },
        async manageSubmitFunc() {
            let result = await this.$u.api.manageCreate(this.manageDetail);
            if (!result) {
                return false;
            }
            this.$refs.uToast.show({
                title: '提交成功',
                type: 'success',
                url: '/pages/manage/detail'
            });
        }
    }
};
</script>

<style lang="scss">
.wo-page-body {
    background-color: #fff;
    border-radius: uni-unit(10px);
    &::after {
        border-radius: uni-unit(10px);
    }
}
</style>
